<template>
	<view >
		<!-- 状态栏高度 设置背景色 占位状态栏-->
		<view class="ztl"
			:style="{'height':statusBarHeight}"></view>
		<!-- 占位盒子 -->
		<view class=""
			:style="{'height': hieght}"></view>
		<!-- 导航栏 -->
		<navBar bgColor="#FFF">
			<image :slot="'left'"
				@click='navToBack'
				:src="xcxImgUrl && xcxImgUrl+'fanhui.svg'"
				style="width: 36rpx;height: 36rpx;"></image>
			<text :slot="'content'">确认支付</text>
		</navBar>
		
		<view 
		:style="{'height': 'calc(100vh - ' + demoTopHieght +')'}"
		class="main_successPay mt10">
			
			<view class="main_successPay_item">
				<image :src="xcxImgUrl && xcxImgUrl+'page_public/static/chengong.png'"></image>
				<view class="main_successPay_item_title">
					支付成功
				</view>
				<view class="main_successPay_item_text">
					恭喜你下单成功，该页面将在 5S 后关闭，你也可以点击下方按钮返回订单页面。
				</view>
			</view>
			
			<view @click="toAllOrder" style="margin-top: 50rpx;" class="">
				<newBtn bgColor="#ec4141" color="#fff" name="确定"></newBtn>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	import newBtn from '@/components/newBtn/newBtn.vue'
	export default {
		computed:{
			...mapGetters(['demoTopHieght']),
		},
		components:{
			newBtn
		},
		data() {
			return {
				statusBarHeight:'',
				hieght:'',
				timer:null
			};
		},
		onLoad(options) {
			// console.log(location.href);
			// if(options?.openId){
			// 	uni.setStorageSync('wxOpenId',options?.openId)
			// }
			console.log(111222333);
			//5秒返回
			this.timer = setTimeout(()=>{
				// uni.navigateTo({
				// 	url:`/page_public/allOrder?statusInfo=${JSON.stringify({status:0,payStatus:0})}`
				// })
				uni.switchTab({
					url:`/pages/myde/myde`
				})
			},5000)
		},
		onUnload(){
			// clearTimeout(this.timer);
		},
		onShow() {
			this.$nextTick(() => {
				// 获取状态栏的高度
				this.statusBarHeight = this.$store.state.statusBarHeight * 2 + 'rpx'
				// 计算站位的高度
				this.hieght = (this.$store.state.navBarHeight) * 2 + 'rpx'
				//获取高度
				this.Utils.getDemoTopHeight('main_successPay')
			})
		},
		methods:{
			//返回
			navToBack(){
				clearTimeout(this.timer);
				// uni.navigateTo({
				// 	url:`/page_public/allOrder?statusInfo=${JSON.stringify({status:0,payStatus:0})}`
				// })
				uni.switchTab({
					url:`/pages/myde/myde`
				})
			},
			//确定点击
			toAllOrder(){
				clearTimeout(this.timer);
				// uni.navigateTo({
				// 	url:`/page_public/allOrder?statusInfo=${JSON.stringify({status:0,payStatus:0})}`
				// })
				uni.switchTab({
					url:`/pages/myde/myde`
				})
			}
			
		}
	}
</script>

<style lang="scss" scoped>
.main_successPay{
	width: 100%;
	box-sizing: border-box;
	
	.main_successPay_item{
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		
		image{
			width: 160rpx;
			height: 160rpx;
		}
		
		.main_successPay_item_title{
			font-size: $font_size_18;
			color: $text_color_333;
			font-weight: bold;
			margin-top: 40rpx;
			margin-bottom: 40rpx;
		}
		
		.main_successPay_item_text{
			font-size: $font_size_14;
			color: $text_color_808080;
		}
		
	}
}
</style>
